<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>基本信息</title>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link href="https://cdn.bootcss.com/framework7/1.6.5/css/framework7.ios.min.css" rel="stylesheet">
    <link href="https://cdn.bootcss.com/framework7/1.6.5/css/framework7.ios.colors.css" rel="stylesheet">

</head>
<body>

<div class="views">
    <div class="view view-main">
        <div class="pages">
            <div data-page="index" class="page navbar-fixed toolbar-fixed">
                <div class="navbar">
                    <div class="navbar-inner">
                        <div class="left">
                            <a href="/travel/view/" class="link">
                                <i class="icon icon-back"></i>
                            </a>
                        </div>
                        <div class="center">基本信息</div>
                        <div class="right">
                            <a onclick="submitForm()">完成</a>
                        </div>
                    </div>
                </div>

                <div class="page-content">
                    <div class="list-block">
                        <ul>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-title label">姓名</div>
                                        <div class="item-input">
                                            <input id="name" type="text" placeholder="请输入姓名">
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-title label">微信号</div>
                                        <div class="item-input">
                                            <input id="wxId" type="text" placeholder="请输入微信号">
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-title label">年龄</div>
                                        <div class="item-input">
                                            <select id="age">
                                                <option value="-1">请选择年龄</option>
                                                <option value="1">70后</option>
                                                <option value="2">80后</option>
                                                <option value="3">90后</option>
                                                <option value="4">00后</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div  class="item-title label">性别</div>
                                        <div class="item-input">
                                            <select id="gender" disabled="disabled">
                                              <option value="1">男</option>
                                              <option value="2">女</option>
                                            </select>
                                        </div>
                                    </div>
                                </div>
                            </li>
                            <li>
                                <div class="item-content">
                                    <div class="item-inner">
                                        <div class="item-title label">简介</div>
                                        <div class="item-input">
                                            <input id="description" type="text" placeholder="介绍下自己">
                                        </div>
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>

                    <div class="list-block">
                        <ul>

                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

</body>
<script src="https://cdn.bootcss.com/framework7/1.6.5/js/framework7.min.js"></script>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.bootcss.com/jquery-cookie/1.4.1/jquery.cookie.js"></script>
<script>
    var myApp = new Framework7();
    var $$ = Dom7;
    var games;
    var recordLenth = 1;
    $(document).ready(function(){
        //获取用户信息
        $.ajax({
            url:"/api/user/" + $.cookie('openId'),
            type:"get",
            success:function(data,textStatus,jqXHR){
                $("#name").val(data.wxname);
                $("#wxId").val(data.wxid);
                $("#age").val(data.age);
                $("#gender").val(data.gender);
                $("#description").val(data.description);
            },
        });
        //获取比赛信息
        $.ajax({
            url:"/api/game",
            type:"get",
            success:function(data,textStatus,jqXHR){
                games = data;

                $.ajax({
                url: "/travel/list/user/",
                type:"get",
                success:function(data,textStatus,jqXHR){
                    for(var i = 0; i < data.list.length; i ++){
                        var travel = data.list[i];
                        addTravel(travel);
                    }
                },
            });
            }
        });

    });


    //添加行程
    function addTravel(travel) {
        recordLenth += 1;
        var newHtml = '<div class="list-block"><ul><li><div class="item-content"><div class="item-inner"><div class="item-title label">比赛</div><div class="item-input">'
           + '<select id="match' + recordLenth + '" name="match" value="' + travel.matchId + '"></select>'
            + '</div></div></div></li><li><div class="item-content"><div class="item-inner"><div class="item-title label">时间</div><div class="item-input">'
            + '<input type="date" name="startDate" placeholder="请输入出发时间" value="' + travel.startDate + '">'
            + '</div></div></div></li><li><div class="item-content"><div class="item-inner"><div class="item-title label">出发地</div><div class="item-input">'
            + '<input name="location" type="text" placeholder="请输入出发地">'
            + ' </div></div></div></li><li><div class="item-content"><div class="item-inner"><div class="item-title label">方式</div><div class="item-input">'
            + '<input name="vehicle" type="text" placeholder="请输入交通工具">'
            + '</div></div></div></li>'
            + '<li><div class="item-content"><div class="item-inner"><div class="item-title label">具体方式</div><div class="item-input">'
            + '<input name="vehicleNo" type="text" placeholder="请输入航班号/列车号等具体信息">'
            + '</div></div></div></li>'
            + '<li><div class="item-content"><div class="item-inner"><div class="item-title label">酒店</div><div class="item-input">'
            + '<select name="hotel" onchange="changeHotelSelect(this)"><option value="0">未预定酒店</option><option value="1">已预订酒店</option></select>'
            + '</div></div></div></li></ul></div>';
        $(newHtml).insertBefore(".list-block:last");
        addGameSelect("match" + recordLenth, games)
    }

    //选择框添加比赛
    function addGameSelect(selectId,games){
        $("#" + selectId).append("<option value=-1>请选择观看比赛</option>");
        for(var i = 0; i < games.length; i ++){
            game = games[i];
            $("#" + selectId).append("<option value=" + game.id + ">" + game.home_team + "-" + game.away_team + "</option>");
        }
    }


</script>
<!--cnzz统计代码,误删-->
<script type="text/javascript">var cnzz_protocol = (("https:" == document.location.protocol) ? " https://" : " http://");
document.write(unescape("%3Cspan id='cnzz_stat_icon_1267142462'%3E%3C/span%3E%3Cscript src='" + cnzz_protocol + "s13.cnzz.com/z_stat.php%3Fid%3D1267142462%26show%3Dpic1' type='text/javascript'%3E%3C/script%3E"));</script>

</html>